var CanvasShapes = (function () {
    var CanvasShapes = function(canvasContainerId){
        this.context = getContext(canvasContainerId);

        function getContext(id) {
            var canvas = document.getElementById(id);

            return canvas.getContext('2d');
        }
    };

    CanvasShapes.prototype = {
        strokeLine : function strokeLine(x1, y1, x2, y2) {
            this.context.beginPath();
            this.context.moveTo(x1, y1);
            this.context.lineTo(x2, y2);
            this.context.stroke();
            this.context.closePath();
        },

        strokeRectangle : function strokeRectangle(x, y, width, height) {
            this.context.strokeRect(x, y, width, height);
        },

        strokeCircle : function strokeCircle(x, y, radius) {
            this.context.beginPath();
            this.context.arc(x, y, radius, 0, 2 * Math.PI);
            this.context.stroke();
            this.context.closePath();
        }
    };

    return CanvasShapes;
})();

var canvasShapesObject = new CanvasShapes('canvas-container');
canvasShapesObject.strokeLine(290, 370, 340, 282);
canvasShapesObject.strokeLine(340, 282, 390, 370);
canvasShapesObject.strokeLine(390, 370, 290, 370);
canvasShapesObject.strokeRectangle(317, 324, 46, 46);
canvasShapesObject.strokeCircle(340, 340, 57);